<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>

<div class="modal-dialog ms-modal-dialog" style="width: 800px;">
  <div class="modal-content">

    <div class="modal-header">
      <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
      <h4 class="modal-title">编辑</h4>
    </div>
	  
	  <form class="form-horizontal ms-form modal-search-form" method="POST" action="${ctx.host}/tractors/${tractor.id}/edit-info" data-validate="true" autocomplete="off">
	    
	    <input type="hidden" name="_method" value="PATCH"/>
	    <input type="hidden" name="id" value="${tractor.id}"/>
	    
	    <div class="modal-body">
      
        <div class="form-group  ms-form-group">
		      <label class="control-label col-xs-3"><span class="color-red">*</span>中文车牌号：</label>
		      <div class="col-xs-3 pull-left">
		        <c:choose>
			        <c:when test="${tractor.status.editing or tractor.status.rejected}">
				        <input type="text" name="brandCNCode" class="form-control" placeholder="中文车牌号" value="${tractor.brandCNCode}" data-validate="required|brand_cn_code">
			        </c:when>
			        <c:otherwise>
			          <label>${tractor.brandCNCode}</label>
			        </c:otherwise>
		        </c:choose>
		      </div>
		      
		      <label class="control-label col-xs-2"><span class="color-red">*</span>英文车牌号：</label>
          <div class="col-xs-3 pull-left">
            <c:choose>
              <c:when test="${tractor.status.editing or tractor.status.rejected}">
                <input type="text" name="brandENCode" class="form-control" placeholder="英文车牌号" value="${tractor.brandENCode}" data-validate="required|brand_en_code">
              </c:when>
              <c:otherwise>
                <label>${tractor.brandENCode}</label>
              </c:otherwise>
            </c:choose>
          </div>
		    </div>
		    
		    <div class="form-group  ms-form-group">
		      <label class="control-label col-xs-3"><span class="color-red">*</span>品牌：</label>
		      <div class="col-xs-3 pull-left">
		        <input type="text" name="brand" class="form-control" placeholder="品牌" value="${tractor.brand}" data-validate="required">
		      </div>
		      
		      <label class="control-label col-xs-2"><span class="color-red">*</span>VIN码：</label>
	        <div class="col-xs-3 pull-left">
	          <input type="text" name="vincode" value="${tractor.vincode}" data-validate="required" class="form-control" placeholder="VIN码" >
	        </div>
		    </div>
		    
		    <div class="form-group  ms-form-group">
		      <label class="control-label col-xs-3"><span class="color-red">*</span>发证日期：</label>
		      <div class="col-xs-3 pull-left">
		        <input type="text" name="issuingTime" class="form-control date" value="<fmt:formatDate value="${tractor.issuingTime}" pattern="yyyy-MM-dd"/>" placeholder="发证日期" data-validate="required" tabindex="6" autocomplete="off"/>
		      </div>
		  
		      <label class="control-label col-xs-2"><span class="color-red">*</span>注册时间：</label>
		      <div class="col-xs-3 pull-left">
		        <input type="text" name="registrationTime" class="form-control date" value="<fmt:formatDate value="${tractor.registrationTime}" pattern="yyyy-MM-dd"/>" placeholder="注册日期" data-validate="required" tabindex="6" autocomplete="off"/>
		      </div>
		    </div>
		    
		    <div class="form-group ms-form-group">
		      <label class="control-label col-xs-3"><span class="color-red">*</span>轴数：</label>
          <div class="col-xs-3 pull-left">
            <input type="text" name="axles" value="${tractor.axles}" data-validate="required|number" class="form-control" placeholder="轴数" tabindex="6" autocomplete="off" />
          </div>
          
          <label class="control-label col-xs-2"><span class="color-red">*</span>年检有效期至：</label>
	        <div class="col-xs-3 pull-left">
	          <input type="text" name="annualInspectionDate" data-validate="required" value="<fmt:formatDate value="${tractor.annualInspectionDate}" pattern="yyyy-MM"/>" class="form-control month" placeholder="年检有效期至" tabindex="5" autocomplete="off"/>
	        </div>
		    </div>
		    
		    <div class="form-group ms-form-group">
	        <label class="control-label col-xs-3"><span class="color-red">*</span>马力：</label>
	        <div class="col-xs-3 pull-left">
	          <input type="text" name="horsepower" data-validate="required|number" class="form-control" placeholder="品牌" value="${tractor.horsepower}">
	        </div>
          
          <label class="control-label col-xs-2"><span class="color-red">*</span>产证所有者：</label>
          <div class="col-xs-3 pull-left">
            <input type="text" name="floorLord" class="form-control" placeholder="产证所有者" value="${tractor.floorLord}" data-validate="required">
          </div>
		    </div>
        
        <div class="form-group ms-form-group">
          <label class="control-label col-xs-3"><span class="color-red">*</span>运输工具类型：</label>
          <div class="col-xs-3 pull-left">
            <select name="transMean" data-validate="required" class="select2 form-control" tabindex="6">
              <option></option>
              <c:forEach var="transMean" items="${enums['TransMean']}">
                <option value="${transMean}" ${tractor.transMean eq transMean ? 'selected' : ''}>${transMean.description}</option>
              </c:forEach>
            </select>
          </div>
          
          <label class="control-label col-xs-2"><span class="color-red">*</span>装载量：</label>
          <div class="col-xs-3 pull-left">
            <input type="text" name="trainload" class="form-control" placeholder="装载量" value="${tractor.trainload}" data-validate="required|number">
          </div>
        </div>
        
        <div class="form-group ms-form-group">
          <label class="control-label col-xs-3"><span class="color-red">*</span>车辆类型（行驶证）：</label>
          <div class="col-xs-3 pull-left">
            <select name="vehicleType" data-validate="required" class="select2 form-control">
              <option></option>
              <c:forEach var="vehicleType" items="${enums['TractorVehicleType']}">
                <option value="${vehicleType}" ${tractor.vehicleType eq vehicleType ? 'selected' : ''}>${vehicleType.description}</option>
              </c:forEach>
            </select>
          </div>
          
          <label class="control-label col-xs-2">7&nbsp;<span class="color-red">*</span>车辆所属权 ：</label>
          <div class="col-xs-3 pull-left">
            <select name="carOwnership" data-validate="required" class="select2 form-control" tabindex="7">
              <option></option>
              <c:forEach var="carOwnership" items="${enums['CarOwnership']}">
                <option value="${carOwnership}" ${tractor.carOwnership eq carOwnership ? 'selected' : ''}>${carOwnership.description}</option>
              </c:forEach>
            </select>
          </div>
        </div>
        
	    </div>
	  
	    <div class="modal-footer ms-modal-footer">
        <button type="submit" class="btn ms-btn btn-primary btn-submit">确定</button>
        <button type="button" class="btn ms-btn ms-btn-gary" data-dismiss="modal">取消</button>
      </div>
	    
	  </form>
	  
  </div>
</div>

<script>
  $(document).ready(function(){
    
    $('select[name="transMean"]').select2({
      placeholder: '请选择',
      minimumResultsForSearch: -1,
      allowClear: true,
    });
    
    $('select[name="vehicleType"]').select2({
      placeholder: '请选择',
      minimumResultsForSearch: -1,
      allowClear: true,
    });

    $('.date').datetimepicker({
      format: 'yyyy-mm-dd',
      autoclose: true,
      language: 'zh-CN',
      todayBtn: 'linked',
      startDate: '${today}',
      todayHighlight: true,
      pickerPosition: 'bottom-right',
      minView: 'month'
    });
    
    $('.month').datetimepicker({  
      format: 'yyyy-mm',
      autoclose: true,  
      weekStart: 1,  
      startView: 3,  
      minView: 3,  
      forceParse: false,  
      language: 'zh-CN'  
    }); 
    
    $('select[name="carOwnership"]').select2({
      theme: "classic",
      placeholder: '请选择',
      minimumResultsForSearch: -1,
      allowClear: true,
    });
    
  });
</script>